<template>
  <view class="login">
    <view class="img">
      <u-image
        width="150rpx"
        height="150rpx"
        :src="src"
        shape="circle"
      ></u-image>
    </view>
    <!-- 问候语 -->
    <view class="tips"> 你的快递我来帮你取，你负责学习就行了 </view>
    <u-button
      :custom-style="customStyle"
      :hair-line="false"
      shape="circle"
      @click="login"
      withCredentials="true"
    >
      <i class="custom-icon-weixin custom-icon"></i>&nbsp;微信授权登录
    </u-button>

    <u-toast ref="loginRef" />
  </view>
</template>

<script>
export default {
  data() {
    return {
      src: require("@/static/userCenter/headerImg.jpeg"),
      customStyle: {
        marginTop: "20px", // 注意驼峰命名，并且值必须用引号包括，因为这是对象
        backgroundColor: "#adb838",
        width: "95vw",
        color: "#FFFFFF",
      },
    };
  },
  methods: {
    login() {
      let _this = this;
      wx.getUserProfile({
        desc: "展示用户信息", // 声明获取用户个人信息后的用途，后续会展示在弹窗中，请谨慎填写
        success: (res) => {
          console.log(res);
          wx.login({
            success: (loginRes) => {
              console.log(loginRes);
              var form = {
                avatarUrl: res.userInfo.avatarUrl,
                gender:
                  res.userInfo.gender == 0
                    ? "未知"
                    : res.userInfo.gender == 1
                    ? "男"
                    : "女",
                nickName: res.userInfo.nickName,
                isLogin: true,
              };
              // 这里请求数据
              var ApiForm = {
                code: loginRes.code,
                name: res.userInfo.nickName,
                avatarUrl: res.userInfo.avatarUrl,
                gender: form.gender,
              };
              _this.$u.api.userLoginApi(ApiForm).then((res) => {
                //判断是否被拉黑
                if (res.data.status === 0) {
                  _this.$refs.loginRef.show({
                    title: "抱歉本账户已被管理员拉黑,具体请咨询本校客服",
                    type: "error ",
                    icon: true,
                  });
                } else {
                  // 将返回来的token 存到Vuex
                  form.userToken = res.data.token;
                  //学校
                  form.schoolId = res.data.schoolId;
                  //角色
                  form.userRole = res.data.userRole;
                  // 将数据存到Vuex
                  _this.$u.vuex("vuex_userInfo", form);
                  // // 返回上一层
                  // uni.navigateBack({
                  //   delta: -1,
                  // });
                  uni.switchTab({
                    url: "/pages/index/index",
                  });
                }
              });
            },
          });
        },
      });
    },
    getuserProfile: function () {
      let _this = this;
      uni.login({
        provider: "weixin",
        success: function (loginRes) {
          console.log(loginRes);
          // 获取用户信息
          wx.getUserProfile({
            success: function (res) {
              console.log(res);

              // var form = {
              //   avatarUrl: res.userInfo.avatarUrl,
              //   gender:
              //     res.userInfo.gender == 0
              //       ? "未知"
              //       : res.userInfo.gender == 1
              //       ? "男"
              //       : "女",
              //   nickName: res.userInfo.nickName,
              //   isLogin: true,
              // };
              // // 这里请求数据
              // var ApiForm = {
              //   code: loginRes.code,
              //   name: res.userInfo.nickName,
              //   avatarUrl: res.userInfo.avatarUrl,
              //   gender: form.gender,
              // };
              // _this.$u.api.userLoginApi(ApiForm).then((res) => {
              //   //判断是否被拉黑
              //   if (res.data.status === 0) {
              //     _this.$refs.loginRef.show({
              //       title: "抱歉本账户已被管理员拉黑,具体请咨询本校客服",
              //       type: "error ",
              //       icon: true,
              //     });
              //   } else {
              //     // 将返回来的token 存到Vuex
              //     form.userToken = res.data.token;
              //     //学校
              //     form.schoolId = res.data.schoolId;
              //     //角色
              //     form.userRole = res.data.userRole;
              //     // 将数据存到Vuex
              //     _this.$u.vuex("vuex_userInfo", form);
              //     // // 返回上一层
              //     // uni.navigateBack({
              //     //   delta: -1,
              //     // });
              //     uni.switchTab({
              //       url: "/pages/index/index",
              //     });
              //   }
              // });
            },
            fail(error) {
              console.log(error);
            },
          });
        },
      });
    },
  },
  //请求数据
  created() {},
};
</script>

<style scoped lang ='less' >
.login {
  width: 100vw;
  height: 100vh;
  background-color: #f1f8fa;
  display: flex;
  flex-direction: column;
  align-items: center;
  .img {
    height: 200px;
    line-height: 300px;
  }
  .tips {
    color: #919293;
    font-size: 14px;
    margin: 30px;
  }
}
</style>
